<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>全局 API | epg-focus-vue</title>
    <meta name="description" content="主要应用于电视端焦点交互">
    <meta name="generator" content="VuePress 1.4.0">
    <meta name="theme-color" content="#3eaf7c">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
    
    <link rel="preload" href="/epg-focus/assets/css/0.styles.33941019.css" as="style"><link rel="preload" href="/epg-focus/assets/js/app.b31e66c6.js" as="script"><link rel="preload" href="/epg-focus/assets/js/2.20e6004e.js" as="script"><link rel="preload" href="/epg-focus/assets/js/16.bd815638.js" as="script"><link rel="prefetch" href="/epg-focus/assets/js/10.2514fb4c.js"><link rel="prefetch" href="/epg-focus/assets/js/11.793ea926.js"><link rel="prefetch" href="/epg-focus/assets/js/12.01e4e231.js"><link rel="prefetch" href="/epg-focus/assets/js/13.1423ccd0.js"><link rel="prefetch" href="/epg-focus/assets/js/14.115308bc.js"><link rel="prefetch" href="/epg-focus/assets/js/15.8399aeea.js"><link rel="prefetch" href="/epg-focus/assets/js/17.dd77a29f.js"><link rel="prefetch" href="/epg-focus/assets/js/18.ae87f8b0.js"><link rel="prefetch" href="/epg-focus/assets/js/19.c6e425a9.js"><link rel="prefetch" href="/epg-focus/assets/js/20.5dd0cf52.js"><link rel="prefetch" href="/epg-focus/assets/js/21.b87d0d78.js"><link rel="prefetch" href="/epg-focus/assets/js/22.5709ae7e.js"><link rel="prefetch" href="/epg-focus/assets/js/23.1c381a02.js"><link rel="prefetch" href="/epg-focus/assets/js/24.a133fc1f.js"><link rel="prefetch" href="/epg-focus/assets/js/25.d262c8d0.js"><link rel="prefetch" href="/epg-focus/assets/js/26.825a6650.js"><link rel="prefetch" href="/epg-focus/assets/js/27.57eb15d3.js"><link rel="prefetch" href="/epg-focus/assets/js/28.5b056900.js"><link rel="prefetch" href="/epg-focus/assets/js/3.7cc2bdd4.js"><link rel="prefetch" href="/epg-focus/assets/js/4.82f74d64.js"><link rel="prefetch" href="/epg-focus/assets/js/5.fe38ea94.js"><link rel="prefetch" href="/epg-focus/assets/js/6.0d7ca19c.js"><link rel="prefetch" href="/epg-focus/assets/js/7.4478646a.js"><link rel="prefetch" href="/epg-focus/assets/js/8.0d360ba2.js"><link rel="prefetch" href="/epg-focus/assets/js/9.40007ddf.js">
    <link rel="stylesheet" href="/epg-focus/assets/css/0.styles.33941019.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/epg-focus/" class="home-link router-link-active"><!----> <span class="site-name">epg-focus-vue</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/epg-focus/guide/" class="nav-link">
  引导
</a></div><div class="nav-item"><a href="/epg-focus/v1/" class="nav-link">
  v1
</a></div><div class="nav-item"><a href="/epg-focus/v2/" class="nav-link router-link-active">
  v2
</a></div><div class="nav-item"><a href="/epg-focus/v3/" class="nav-link">
  v3
</a></div><div class="nav-item"><a href="https://gitee.com/wyzhgx/focus-vue" target="_blank" rel="noopener noreferrer" class="nav-link external">
  gitee
  <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></div><div class="nav-item"><a href="https://www.npmjs.com/package/epg-focus-vue" target="_blank" rel="noopener noreferrer" class="nav-link external">
  npm
  <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></div> <!----></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/epg-focus/guide/" class="nav-link">
  引导
</a></div><div class="nav-item"><a href="/epg-focus/v1/" class="nav-link">
  v1
</a></div><div class="nav-item"><a href="/epg-focus/v2/" class="nav-link router-link-active">
  v2
</a></div><div class="nav-item"><a href="/epg-focus/v3/" class="nav-link">
  v3
</a></div><div class="nav-item"><a href="https://gitee.com/wyzhgx/focus-vue" target="_blank" rel="noopener noreferrer" class="nav-link external">
  gitee
  <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></div><div class="nav-item"><a href="https://www.npmjs.com/package/epg-focus-vue" target="_blank" rel="noopener noreferrer" class="nav-link external">
  npm
  <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></div> <!----></nav>  <ul class="sidebar-links"><li><section class="sidebar-group depth-0"><p class="sidebar-heading open"><span>v2.x开发文档</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/epg-focus/v2/" class="sidebar-link">全局配置</a></li><li><a href="/epg-focus/v2/api.html" class="active sidebar-link">全局 API</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#version" class="sidebar-link">version</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#options" class="sidebar-link">$options</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#pointer" class="sidebar-link">pointer</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#popsign" class="sidebar-link">popSign</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#direction" class="sidebar-link">direction</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#getsignlist" class="sidebar-link">getSignList</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#openpop" class="sidebar-link">openPop</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#addpopevent" class="sidebar-link">addPopEvent</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#closepop" class="sidebar-link">closePop</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#checkfocus" class="sidebar-link">checkFocus</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#movefocus" class="sidebar-link">moveFocus</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#initfocus" class="sidebar-link">initFocus</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#next" class="sidebar-link">next</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#prev" class="sidebar-link">prev</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#start" class="sidebar-link">start</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#end" class="sidebar-link">end</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#clearfocus" class="sidebar-link">clearFocus</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#checksign" class="sidebar-link">checkSign</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#getsign" class="sidebar-link">getSign</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#nextsign" class="sidebar-link">nextSign</a></li><li class="sidebar-sub-header"><a href="/epg-focus/v2/api.html#prevsign" class="sidebar-link">prevSign</a></li></ul></li><li><a href="/epg-focus/v2/event.html" class="sidebar-link">按键事件</a></li><li><a href="/epg-focus/v2/long-event.html" class="sidebar-link">按键长按事件</a></li><li><a href="/epg-focus/v2/items.html" class="sidebar-link">items</a></li><li><a href="/epg-focus/v2/group.html" class="sidebar-link">group</a></li><li><a href="/epg-focus/v2/keep-alive.html" class="sidebar-link">keepAlive 应用方案</a></li></ul></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="全局-api"><a href="#全局-api" class="header-anchor">#</a> 全局 API</h1> <h2 id="version"><a href="#version" class="header-anchor">#</a> version</h2> <ul><li><strong>Type</strong>：<code>String</code></li> <li><strong>只读</strong></li> <li><strong>简介</strong>：查看插件版本号。</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span>version<span class="token punctuation">;</span>
</code></pre></div><h2 id="options"><a href="#options" class="header-anchor">#</a> $options</h2> <ul><li><strong>Type</strong>：<code>Object</code></li> <li><strong>只读</strong></li> <li><strong>简介</strong>：可以查看当前插件示例基础配置信息。</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span>$options<span class="token punctuation">;</span>
</code></pre></div><h2 id="pointer"><a href="#pointer" class="header-anchor">#</a> pointer</h2> <ul><li><strong>Type</strong>：<code>Object</code></li> <li><strong>default</strong>：<code>null</code></li> <li><strong>只读</strong></li> <li><strong>简介</strong>：获取与当前活跃层级<code>popsign</code>相对应的焦点对象</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span>pointer<span class="token punctuation">;</span>
</code></pre></div><h2 id="popsign"><a href="#popsign" class="header-anchor">#</a> popSign</h2> <ul><li><strong>Type</strong>：<code>String</code></li> <li><strong>default</strong>：<code>&quot;&quot;</code></li> <li><strong>只读</strong></li> <li><strong>简介</strong>：对应当前活跃层级标记名称；与 <code>item</code> 和 <code>group</code> 的 <code>popup</code> 属性名称对应；如果未设置<code>popup</code>属性，默认为<code>&quot;&quot;</code></li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span>popSign<span class="token punctuation">;</span>
</code></pre></div><h2 id="direction"><a href="#direction" class="header-anchor">#</a> direction</h2> <ul><li><strong>Type</strong>：<code>String</code></li> <li><strong>default</strong>：<code>&quot;&quot;</code></li> <li><strong>只读</strong></li> <li><strong>简介</strong>：当前响应按键的名称（全小写）；取值有：left、right、up、down、enter、back 等，更多可参考 <code>keyMaps</code> 中的键名</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span>direction<span class="token punctuation">;</span>
</code></pre></div><h2 id="getsignlist"><a href="#getsignlist" class="header-anchor">#</a> getSignList</h2> <ul><li><strong>Type</strong>：<code>Function</code></li> <li><strong>参数</strong>：
<ul><li><code>{String|Object} sign</code> 分组标记</li> <li><code>{String} popup（非必传字段）</code> 弹层标记，不传是位默认层级</li></ul></li> <li><strong>简介</strong>：根据焦点元素或弹层标记及标签标记获取分组列表</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token comment">// 获取默认层级中nav标记列表</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">getSignList</span><span class="token punctuation">(</span><span class="token string">&quot;nav&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 获取含有sign标记的焦点对应的列表</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">getSignList</span><span class="token punctuation">(</span>pointer<span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="openpop"><a href="#openpop" class="header-anchor">#</a> openPop</h2> <ul><li><strong>Type</strong>：<code>Function</code></li> <li><strong>参数</strong>：
<ul><li><code>{String} popup</code> 层级标记，指定层级标记时，为打开对应弹层；传为空字符串时，则为关闭所有弹层，回到默认层级</li> <li><code>{Function} fn（非必传字段）</code> 焦点初始化方法，默认执行<code>initFocus(0, 0)</code></li></ul></li> <li><strong>简介</strong>：传入相应的层级标记，切换到对应的层级。</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token comment">// 'popup'为目标弹层的层级的标记名称</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">openPop</span><span class="token punctuation">(</span><span class="token string">&quot;popup&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="addpopevent"><a href="#addpopevent" class="header-anchor">#</a> addPopEvent</h2> <ul><li><strong>Type</strong>：<code>Function</code></li> <li><strong>参数</strong>：
<ul><li><code>{String} popup</code> 层级标记名称</li> <li><code>{Object} events</code> 事件集合。包含<code>keyUp、keyDown、keyLeft、keyRight、keyEnter、keyBack</code>等按键及按键长按事件中涉及的按键操作</li></ul></li> <li><strong>简介</strong>：在打开的弹层中某些事件需要特殊处理时，可以使用该方法增加相应事件的处理逻辑</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">addPopEvent</span><span class="token punctuation">(</span><span class="token string">'popup'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span><span class="token function">keyUp</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token function">keydown</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token operator">...</span><span class="token punctuation">}</span><span class="token punctuation">)</span>
</code></pre></div><h2 id="closepop"><a href="#closepop" class="header-anchor">#</a> closePop</h2> <ul><li><strong>Type</strong>：<code>Function</code></li> <li><strong>简介</strong>：根据打开层级的顺序，倒序将层级切换到对应层级上，在关闭弹层或切换默认层级时调用;如果默认层级没有焦点信息，则执行<code>initFocus(0, 0)</code></li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">closePop</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="checkfocus"><a href="#checkfocus" class="header-anchor">#</a> checkFocus</h2> <ul><li><p><strong>Type</strong>：<code>Function</code></p></li> <li><p><strong>参数</strong>：</p> <ul><li><code>{Object} pointer（非必传字段）</code> 传入指定焦点</li></ul></li> <li><p><strong>简介</strong>：根据传入焦点内容，设置当前焦点</p></li> <li><p><strong>输出</strong>：<code>pointer</code>/<code>undefined</code>，返回<code>undefined</code>时表示传入焦点对象为当前页面焦点对象/未传入焦点</p></li> <li><p><strong>应用</strong>：</p></li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token comment">// pointer不传是默认在当前活跃层级移动焦点</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">checkFocus</span><span class="token punctuation">(</span>pointer<span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="movefocus"><a href="#movefocus" class="header-anchor">#</a> moveFocus</h2> <ul><li><p><strong>Type</strong>：<code>Function</code></p></li> <li><p><strong>参数</strong>：</p> <ul><li><code>{String} direction</code> 按传入方向<code>up/down/left/right</code>移动焦点</li> <li><code>{Object} pointer（非必传字段）</code> 按传入焦点所在层级移动对应层级焦点</li></ul></li> <li><p><strong>简介</strong>：根据传入焦点的层级以及方向变量移动对应层级的焦点，默认在当前活跃层级移动</p></li> <li><p><strong>输出</strong>：<code>pointer</code>/<code>undefined</code>，返回<code>undefined</code>时表示已移动到边界</p></li> <li><p><strong>应用</strong>：</p></li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token comment">// pointer不传是默认在当前活跃层级移动焦点</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">moveFocus</span><span class="token punctuation">(</span><span class="token string">&quot;up&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="initfocus"><a href="#initfocus" class="header-anchor">#</a> initFocus</h2> <ul><li><p><strong>Type</strong>：<code>Function</code></p></li> <li><p><strong>参数</strong>：</p> <ul><li><code>{Function/Number/pointer} a</code> 焦点筛选条件方法/基准点 X 方向偏移量/指定焦点</li> <li><code>{Function/Number} b</code> 焦点初始化后的回调/基准点 Y 方向偏移量(参数<code>a</code>为数字时必传，参数<code>a</code>为函数时非必传)</li> <li><code>{Function} c（非必传字段）</code> 焦点初始化后的回调</li></ul></li> <li><p><strong>简介</strong>：通用焦点初始化方法</p></li> <li><p><strong>应用</strong>：</p></li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token comment">// 根据条件初始化</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">initFocus</span><span class="token punctuation">(</span>
  <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> Boolean<span class="token punctuation">,</span>
  <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
    <span class="token comment">// do something</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 根据位置信息初始化</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">initFocus</span><span class="token punctuation">(</span><span class="token number">0</span><span class="token punctuation">,</span> <span class="token number">0</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
  <span class="token comment">// do something</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 直接指定焦点初始化（2.0.8版本支持）</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">initFocus</span><span class="token punctuation">(</span>pointer<span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
  <span class="token comment">// do something</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="next"><a href="#next" class="header-anchor">#</a> next</h2> <ul><li><strong>Type</strong>：<code>Function</code></li> <li><strong>参数</strong>：
<ul><li><code>{Boolean} flag（非必传字段）</code> 是否在限定区域内移动</li> <li><code>{Function} fn（非必传字段）</code> 跳转到下一行时执行的操作</li></ul></li> <li><strong>简介</strong>：
<ul><li>如果焦点未抵达页面右侧边界，则操作等同于页面执行<code>right</code>；</li> <li>如果焦点已抵达页面右侧边界，则操作等同于先执行下，然后将焦点移动到对应行的第一个焦点
<ol><li>当<code>flag</code>为真：如果焦点含有<code>group</code>标记，则在<code>group</code>限定区域内执行下一个操作</li> <li>当<code>flag</code>为假：在当前页面执行下一个操作</li></ol></li></ul></li> <li><strong>输出</strong>：<code>pointer</code>/<code>undefined</code>，返回<code>undefined</code>时表示已移动到边界</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token comment">// 不换行</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">next</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 换行</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">next</span><span class="token punctuation">(</span><span class="token boolean">true</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
  <span class="token comment">// do something</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="prev"><a href="#prev" class="header-anchor">#</a> prev</h2> <ul><li><strong>Type</strong>：<code>Function</code></li> <li><strong>参数</strong>：
<ul><li><code>{Boolean} flag（非必传字段）</code> 是否在限定区域内移动</li> <li><code>{Function} fn（非必传字段）</code> 跳转到上一行时执行的操作</li></ul></li> <li><strong>简介</strong>：
<ul><li>如果焦点未抵达页面左侧边界，则操作等同于页面执行<code>left</code>；</li> <li>如果焦点已抵达页面左侧边界，则操作等同于先执行上，然后将焦点移动到对应行的最后一个焦点
<ol><li>当<code>flag</code>为真：如果焦点含有<code>group</code>标记，则在<code>group</code>限定区域内执行上一个操作</li> <li>当<code>flag</code>为假：在当前页面执行上一个操作</li></ol></li></ul></li> <li><strong>输出</strong>：<code>pointer</code>/<code>undefined</code>，返回<code>undefined</code>时表示已移动到边界</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token comment">// 不换行</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">prev</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// 换行</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">prev</span><span class="token punctuation">(</span><span class="token boolean">true</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
  <span class="token comment">// do something</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="start"><a href="#start" class="header-anchor">#</a> start</h2> <ul><li><p><strong>Type</strong>：<code>Function</code></p></li> <li><p><strong>参数</strong>：</p> <ul><li><code>{Object/Boolean} item（非必传字段）</code> 含有<code>sign</code>标记的焦点对象/布尔值区别是否仅在区域内移动</li></ul></li> <li><p><strong>简介</strong>：</p> <ul><li><strong>未传参或传参布尔值</strong>：
<ol><li>传参为 true，检测焦点区域标记<code>group</code>是否有效、如果有效则根据<code>left</code>操作移动到相应区域内最左侧的焦点；如果<code>group</code>标记无效，则根据<code>left</code>操作移动焦点到页面最左侧焦点</li> <li>未传参、传参为 false 或其他数据类型，则根据<code>left</code>操作移动焦点到页面最左侧焦点</li></ol></li> <li><strong>传参焦点对象</strong>：根据传入的焦点对象所在层级以及<code>sign</code>标记，切换相应<code>sign</code>标记列表的选中状态到页面布局的第一个</li></ul></li> <li><p><strong>应用</strong>：</p></li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">start</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="end"><a href="#end" class="header-anchor">#</a> end</h2> <ul><li><strong>Type</strong>：<code>Function</code></li> <li><strong>参数</strong>：
<ul><li><code>{Object/Boolean} item（非必传字段）</code> 含有<code>sign</code>标记的焦点对象/布尔值区别是否仅在区域内移动</li></ul></li> <li><strong>简介</strong>：
<ul><li><strong>未传参或传参布尔值</strong>：
<ol><li>传参为 true，检测焦点区域标记<code>group</code>是否有效、如果有效则根据<code>right</code>操作移动到相应区域内最右侧的焦点；如果<code>group</code>标记无效，则根据<code>right</code>操作移动焦点到页面最右侧焦点</li> <li>未传参、传参为 false 或其他数据类型，则根据<code>right</code>操作移动焦点到页面最右侧焦点</li></ol></li> <li><strong>传参焦点对象</strong>：根据传入的焦点对象所在层级以及<code>sign</code>标记，切换相应<code>sign</code>标记列表的选中状态到页面布局的第一个</li></ul></li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">end</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="clearfocus"><a href="#clearfocus" class="header-anchor">#</a> clearFocus</h2> <ul><li><strong>Type</strong>：<code>Function</code></li> <li><strong>简介</strong>：清除当前层级焦点内容</li> <li><strong>应用</strong>：</li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">clearFocus</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="checksign"><a href="#checksign" class="header-anchor">#</a> checkSign</h2> <ul><li><p><strong>Type</strong>：<code>Function</code></p></li> <li><p><strong>参数</strong>：</p> <ul><li><code>{String} sign</code> 节点标记名称</li> <li><code>{Function} fn</code> 返回布尔类型来标记当前焦点选中状态</li> <li><code>{String} popup（非必传字段）</code> 节点所在层级标记</li></ul></li> <li><p><strong>简介</strong>：在目标层级上根据<code>Function</code>返回条件切换<code>sign</code>标记的选中状态，默认为当前活跃层级</p></li> <li><p><strong>应用</strong>：</p></li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token comment">// &quot;nav&quot;：类似导航列表添加的标记名称</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">checkSign</span><span class="token punctuation">(</span><span class="token string">&quot;nav&quot;</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">data</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
  <span class="token keyword">return</span> data<span class="token punctuation">.</span>id <span class="token operator">===</span> <span class="token string">&quot;1&quot;</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="getsign"><a href="#getsign" class="header-anchor">#</a> getSign</h2> <ul><li><p><strong>Type</strong>：<code>Function</code></p></li> <li><p><strong>参数</strong>：</p> <ul><li><code>{String} sign</code> 节点标记名称</li> <li><code>{String} popup（非必传字段）</code> 节点所在层级标记</li></ul></li> <li><p><strong>简介</strong>：获取当前标记类型选中状态的焦点对象</p></li> <li><p><strong>输出</strong>：<code>pointer</code>/<code>null</code>，返回<code>null</code>时表示未设置选中状态</p></li> <li><p><strong>应用</strong>：</p></li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">getSign</span><span class="token punctuation">(</span><span class="token string">&quot;sign&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="nextsign"><a href="#nextsign" class="header-anchor">#</a> nextSign</h2> <ul><li><p><strong>Type</strong>：<code>Function</code></p></li> <li><p><strong>参数</strong>：</p> <ul><li><code>{String} sign</code> 节点标记名称</li> <li><code>{String} direction（非必传字段）</code> 方向（默认为向右移动）</li> <li><code>{String} popup（非必传字段）</code> 节点所在层级标记</li></ul></li> <li><p><strong>简介</strong>：仅切换目标<code>popup</code>层级<code>sign</code>标记的选中状态，不影响页面焦点</p></li> <li><p><strong>输出</strong>：<code>pointer</code>/<code>null</code>，返回<code>null</code>时表示已移动到边界</p></li> <li><p><strong>应用</strong>：</p></li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">nextSign</span><span class="token punctuation">(</span><span class="token string">&quot;sign&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="prevsign"><a href="#prevsign" class="header-anchor">#</a> prevSign</h2> <ul><li><p><strong>Type</strong>：<code>Function</code></p></li> <li><p><strong>参数</strong>：</p> <ul><li><code>{String} sign</code> 节点标记名称</li> <li><code>{String} direction（非必传字段）</code> 方向（默认为向左移动）</li> <li><code>{String} popup（非必传字段）</code> 节点所在层级标记</li></ul></li> <li><p><strong>简介</strong>：仅切换目标<code>popup</code>层级<code>sign</code>标记的选中状态，不影响页面焦点</p></li> <li><p><strong>输出</strong>：<code>pointer</code>/<code>null</code>，返回<code>null</code>时表示已移动到边界</p></li> <li><p><strong>应用</strong>：</p></li></ul> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">this</span><span class="token punctuation">.</span>$Focus<span class="token punctuation">.</span><span class="token function">prevSign</span><span class="token punctuation">(</span><span class="token string">&quot;sign&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div></div> <footer class="page-edit"><!----> <!----></footer> <div class="page-nav"><p class="inner"><span class="prev">
      ←
      <a href="/epg-focus/v2/" class="prev router-link-active">
        全局配置
      </a></span> <span class="next"><a href="/epg-focus/v2/event.html">
        按键事件
      </a>
      →
    </span></p></div> </main></div><div class="global-ui"><!----></div></div>
    <script src="/epg-focus/assets/js/app.b31e66c6.js" defer></script><script src="/epg-focus/assets/js/2.20e6004e.js" defer></script><script src="/epg-focus/assets/js/16.bd815638.js" defer></script>
  </body>
</html>
